<template>
  <div id='login'>
    <div class='box'>
      <h4>
        <van-icon size='50'
          name="free-postage" />
        <span>邮帮帮</span>
      </h4>
      <v-login>
      </v-login>
    </div>

  </div>
</template>

<script>
export default {
  name: 'login',
  data() {
    return {}
  },
  components: {
    'v-login': () => import('../components/login'),
  },
  created() {},
  mounted() {
    window.localStorage.setItem('width', document.body.offsetWidth)
    window.localStorage.setItem('height', document.body.offsetHeight)
  },
  methods: {},
}
</script>

<style scoped lang='less'>
#login {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  .box {
    flex: 1;
    background-image: linear-gradient(
      rgba(26, 144, 255, 0.8),
      rgb(247, 247, 247),
      rgb(250, 250, 250)
    );
    position: relative;
    h4 {
      width: 100%;
      font-size: 2rem;
      color: #fff;
      text-align: center;
      position: absolute;
      top: 2rem;
      span {
        vertical-align: middle;
        margin-left: 0.4rem;
      }
      i {
        vertical-align: middle;
      }
    }
  }
}
</style>
